import React from 'react'
import { Button, Stepper, NavBar } from 'antd-mobile'
import { Calendar } from 'antd-mobile'
import { useNavigate } from 'react-router-dom'

function Shop() {
    const navigate = useNavigate()
    const [number, setNumber] = React.useState(50)
    const click = () => {
        navigate('/Orderdetails')
    }
    return (
        <div>
            <div>
                <Calendar />
            </div>
            <div>
                <div>
                    <img src="https://picsum.photos/200/300" alt="" />
                </div>
                <div>"本次画展汇聚了众多国内外知名艺术家的经典作品，展示了不同风格的绘画艺术，让观众能够近距离领略艺术之美。"</div>
            </div>
            <div>
                {number}
                <Stepper
                    min={0}
                    max={5}
                    defaultValue={1}
                    onChange={value => {
                        console.log(value)
                    }}
                />
                <Button color='warning' onClick={click}>购买</Button></div>
        </div>
    )
}

export default Shop
